<template>
  <el-dialog
    class="my-dialog"
    :title="'派单日期：' + assignDate"
    :visible.sync="visible"
    width="70%"
    destroy-on-close
    @closed="closed"
  >
    <div class="app-container">
      <el-table ref="productTable" :data="companys" style="width: 100%" border>
        <el-table-column label="id" align="center">
          <template slot-scope="scope">
            <p>{{ scope.row.id }}</p>
          </template>
        </el-table-column>

        <el-table-column label="公司名称" align="center">
          <template slot-scope="scope">
            <p>{{ scope.row.companyName }}</p>
          </template>
        </el-table-column>
      </el-table>
      <div slot="footer">
        <el-pagination
          background
          @current-change="handleCurrentChangeShowList"
          layout="total,prev, pager, next,jumper"
          :page-size="pageSize"
          :total="total"
          :currentPage.sync="pageNum"
        >
        </el-pagination>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import { getAssignCommpanyHistory } from "../../../api/assign";

import { maxNum, minNum } from "../../../utils/max";

export default {
  data() {
    return {
      companys: [],
      total: 0,
      visible: false,
      pageSize: 0,
      pageNum: 1,

      oldPage: 0,
      lastId: 0,
    };
  },

  props: {
    id: {
      type: Number,
      default: -6,
    },
    assignDate: {
      type: String,
      default: "",
    },

    dialogVisible: false,
  },

  mounted() {
    if (!this.dialogVisible) {
      return;
    }
  },

  watch: {
    dialogVisible: function (newValue, oldValue) {
      console.log("newValue: ", newValue, "oldValue: ", oldValue);

      if (true === newValue) {
        this.visible = true;
        getAssignCommpanyHistory({ id: this.id }, this);

        return;
      }

      this.visible = false;
    },

    pageNum: function (newVal, oldVal) {
      if (newVal === 1) {
        this.lastId = 0;
        console.log("第一页", this.lastId);

        return;
      }

      if (newVal > oldVal && newVal === oldVal + 1) {
        // 页数相邻
        this.lastId = maxNum(this.companys, "id");

        console.log("页数相邻", this.lastId);

        return;
      } 
      
      if (newVal > oldVal && newVal !== oldVal + 1) {
        // 跳转的页数 > 大于老页数 且 页码不相邻
        let num = 0;
        num =
        maxNum(this.companys, "id") +
          (newVal - oldVal - 1) * (this.pageSize || 30);
        this.lastId = num;

        console.log("跳转的页数 > 大于老页数 且 页码不相邻", this.lastId);

        return;
      }
      
      if (newVal < oldVal) {
        let num1 = 0;
        num1 =
          minNum(this.companys, "id") -
          1 -
          (oldVal - newVal) * (this.showPageSize || 30);
        this.lastId = num1;

        console.log("跳转的页数 < 大于老页数 且 页码不相邻", this.lastId);
      }
    },
    deep: true,
  },

  methods: {
    // showVisiable(visiable) {
    //   this.dialogVisible = visiable;
    // },

    closed() {
      this.visible = false;
      this.$emit("close", false);
    },

    handleCurrentChangeShowList(val) {
      this.pageNum = val;

      getAssignCommpanyHistory(
        {
          id: this.id,
          lastId: this.lastId,
          pageNum: this.pageNum,
        },
        this
      );
    },
  },
};
</script>

<style>
</style>